<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="common/common.css">
    <link rel="stylesheet" href="css/index.css">
    <title>Document</title>
</head>

<body>
    <div id="cm-opera-header"></div>
    <div id="cm-opera-nav"></div>
    <br>
    <div id="cm-content">
        <div class="cm-content">
            <div class="cm-content-list-cover">
                <div class="cm-content-list">

                    <div class="cm-content-list-header">
                        <div class="cm-content-list-header-left">
                            <span class="cm-content-list-header-left-icon cm-content-list-header-left-icon-performance"></span>
                            <span class="cm-content-list-header-left-title">演出剧</span>
                        </div>
                        <!-- <div class="cm-content-list-header-right">
                            <span class="cm-content-list-header-right-icon"></span>
                            <span class="cm-content-list-header-right-more">查看更多</span>
                        </div> -->
                    </div>
                    <div class="cm-content-list-header-line">
                    </div>
                    <div class="cm-content-list-main ">
                        <a class="cm-content-list-main-detail" href="operaDetail.html">
                            <div class="cm-content-list-main-detail-top">
                                <img src="images/opera7.png" alt="图片" class="cm-content-list-main-detail-top-img">
                            </div>
                            <div class="cm-content-list-main-detail-bottom">
                                <p>豫剧</p>
                                <div class="cm-content-list-main-detail-bottom-title">
                                    <span>豫剧</span>

                                </div>
                            </div>
                        </a>
                        <a class="cm-content-list-main-detail" href="operaDetail2.html">
                                <div class="cm-content-list-main-detail-top">
                                    <!-- <div class="cm-content-list-main-detail-top-cover">
                                        敬请期待
                                    </div> -->
                                    <img src="images/opera8.png" alt="图片" class="cm-content-list-main-detail-top-img">
                                </div>
                                <div class="cm-content-list-main-detail-bottom">
                                    <p>相声</p>
                                    <div class="cm-content-list-main-detail-bottom-title">
                                        <span>相声</span>
                                    </div>
                                </div>
                            </a>
                            <a class="cm-content-list-main-detail" href="operaDetail3.html">
                                <div class="cm-content-list-main-detail-top">
                                    <!-- <div class="cm-content-list-main-detail-top-cover">
                                        敬请期待
                                    </div> -->
                                    <img src="images/opera9.png" alt="图片" class="cm-content-list-main-detail-top-img">
                                </div>
                                <div class="cm-content-list-main-detail-bottom">
                                    <p>京剧</p>
                                    <div class="cm-content-list-main-detail-bottom-title">
                                        <span>京剧</span>
                                    </div>
                                </div>
                            </a>
    
                            <a class="cm-content-list-main-detail" href="operaDetail4.html">
                                <div class="cm-content-list-main-detail-top">
                                    <!-- <div class="cm-content-list-main-detail-top-cover">
                                        敬请期待
                                    </div> -->
                                    <img src="images/opera4.png" alt="图片" class="cm-content-list-main-detail-top-img">
                                </div>
                                <div class="cm-content-list-main-detail-bottom">
                                    <p>杂技</p>
                                    <div class="cm-content-list-main-detail-bottom-title">
                                        <span>杂技</span>
    
                                    </div>
                                </div>
                            </a>
    
                            <a class="cm-content-list-main-detail" href="operaDetail5.html">
                                <div class="cm-content-list-main-detail-top">
                                    <!-- <div class="cm-content-list-main-detail-top-cover">
                                        敬请期待
                                    </div> -->
                                    <img src="images/prformance1.png" alt="图片" class="cm-content-list-main-detail-top-img">
                                </div>
                                <div class="cm-content-list-main-detail-bottom">
                                    <p>街舞</p>
                                    <div class="cm-content-list-main-detail-bottom-title">
                                        <span>街舞</span>
    
                                    </div>
                                </div>
                            </a>
    
                            <a class="cm-content-list-main-detail" href="operaDetail6.html">
                                <div class="cm-content-list-main-detail-top">
                                    <!-- <div class="cm-content-list-main-detail-top-cover">
                                        敬请期待
                                    </div> -->
                                    <img src="images/opera6.png" alt="图片" class="cm-content-list-main-detail-top-img">
                                </div>
                                <div class="cm-content-list-main-detail-bottom">
                                    <p>昆剧</p>
                                    <div class="cm-content-list-main-detail-bottom-title">
                                        <span>昆剧</span>
    
                                    </div>
                                </div>
                            </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="cm-opera-footer-nav"  style="background: #3d3d3d"></div>
    <div id="cm-opera-footer"></div>

    <script src="js/jquery.js"></script>
    <script src="js/common.js"></script>
    <script>
        $('#cm-opera-header').load('common/common.html header', function () {

        })
        $('#cm-opera-nav').load('common/common.html nav', function () {
            $('.cm-nav-list>li').eq(4).addClass('cm-nav-list-item-active').siblings().removeClass('cm-nav-list-item-active')
            cmPlayer.init();
        })
        $('#cm-opera-footer-nav').load('common/common.html #cm-footer-nav', function () {
            cmPlayer.init();
        })
        $('#cm-opera-footer').load('common/common.html footer', function () {

        })

    </script>


</body>

</html>